<template>
	<view class="settle">
		<!-- 全选按钮 -->
		<view class="cart-checked">
			<radio color="#c00000" :checked="isCheckedAll" @click="checkedAll"/>全选
		</view>
		<!-- 合计 -->
		<view class="total">
			合计:<text class="price">￥{{showPrice}}</text>
		</view>
		<!-- 结算按钮 -->
		<view class="btn-count">
			结算({{checkedCount}})
		</view>
	</view>
</template>

<script>
	import {mapGetters,mapMutations} from 'vuex'
	export default {
		name:"my-settle",
		computed:{
			...mapGetters('m_cart',['checkedCount','showPrice','total']),
			isCheckedAll(){
				return this.total === this.checkedCount;
			}
		},
		data() {
			return {
			};
		},
		methods:{
			...mapMutations('m_cart',['updateAllGoods']),
			checkedAll(){
				this.updateAllGoods(!this.isCheckedAll)
			}
		}
	}
</script>

<style lang="scss">
.settle{
	width: 100%;
	height: 50px;
	position: fixed;
	bottom: 0;
	left: 0;
	font-size: 14px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border:1px solid #C7C7C7;
	background-color: #fff;
}
.total .price{
	color: #c00000;
}
.btn-count{
	width: 100px;
	height: 50px;
	background-color: #c00000;
	text-align: center;
	line-height: 50px;
	color: #fff;
}
</style>
